import React,{useEffect,useState} from 'react';
import { Col, Row ,Card,Table} from 'antd';
import './home.css'
import {getData} from '../../api'


const columns = [
  {
    title: '课程',
    dataIndex: 'name'
  },
  {
    title: '今日购买',
    dataIndex: 'todayBuy'
  },
  {
    title: '本月购买',
    dataIndex: 'monthBuy'
  },
  {
    title: '总购买',
    dataIndex: 'totalBuy'
  }
]


const Home = () => {
  const userImg = require('../../assets/images/user.png')

  useEffect(()=>{
    getData().then(({data})=>{
        console.log(data,'res') 
        const {tableData} = data.data
        setTableData(tableData)
    })
  },[])

  const [tableData,setTableData] =useState([])

  return (
    <Row className='home'>
      <Col span={8}>
        <Card hoverable>
            <div className='user'>
              <img src={userImg}></img>
              <div className='userInfo'>
                 <p className='name'>admin</p>
                 <p className='access'>超级管理员</p>
              </div>
              
            </div>

            <div className='login-info'>
                  <p>上次登录时间:<span>2025-8-28</span></p>
                  <p>上次登录地点:<span>武汉</span></p>
              </div>
        </Card>

        <Card>
           <Table columns={columns} rowKey={"name"} pagination={false} dataSource={tableData}></Table>
        </Card>
      </Col>
      <Col span={16}></Col>
    </Row>
  );
};

export default Home;